
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="Cache-Control"  content="no-transform">
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <link href="/statics/view/css/all.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
        .map{
            height: 100%;
            width: 100%;
            min-height: 700px;
        }
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=A6ebf3292d0ac730ec570674279d1d98"></script>
    <title>单击获取点击的经纬度</title>
</head>
<body>
<form action="">
    <input type="hidden" name="tag" value="${tag}"/>
    <input type="hidden" name="lng" value="${lng}"/>
    <input type="hidden" name="lat" value="${lat}"/>
</form>
<div class="map" id="bdMap">
</div>
<script type="text/javascript">


   var map = null;
   var point = null;
   var myGeo = null;
   var lng,lat;

   /** 加载地图*/
   function initMap() {
       map = new BMap.Map("bdMap");
        point = new BMap.Point(116.331398,39.897445);
       map.centerAndZoom(point,16);

       myGeo = new BMap.Geocoder();   //解析器
       //地图点击事件
       map.addEventListener("click", function (e) {
           lng = e.point.lng;
           lat = e.point.lat;
           $("input[name='lng']").val(lng);
           $("input[name='lat']").val(lat);
       });
       //初始化form
       var $tagInitVal = $("input[name='tag']");
       if($tagInitVal.val()!='undefined'){
           markerByTag($tagInitVal.val());
       }

   }

   /* 通过tag标识地图 */
   function markerByTag(tag) {
       myGeo.getPoint(tag, function (point) {
           if (point) {
               map.centerAndZoom(point, 16);
               map.addOverlay(new BMap.Marker(point));
           }
       }, "武汉市");
   }

   initMap();

</script>


</body>
</html>
